<!DOCTYPE html>
<html lang="zh-CN">

<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>风俗文化 - 黑龙江旅游</title>
    <link rel="stylesheet" href="D:\web1\travel\css\base.css" type="text/css" media="all">
    <link rel="stylesheet" href="D:\web1\travel\css\culture.css" type="text/css" media="all">
    <link href="https://cdn.jsdelivr.net/npm/font-awesome@4.7.0/css/font-awesome.min.css" rel="stylesheet">
</head>

<body>
    <div class="main">
        <!-- 顶部搜索栏和导航 -->
        <div class="top-bar">
            <div class="search-box">
                <form action="search.html" method="get">
                    <input type="text" name="keyword" placeholder="搜索风俗、文化...">
                    <button type="submit"><i class="fa fa-search"></i></button>
                </form>
            </div>

            <ul class="top-nav">
                <li><a href="login.html"><i class="fa fa-user-circle"></i> 登录</a></li>
                <li><a href="register.html"><i class="fa fa-user-plus"></i> 注册</a></li>
                <li><a href="about.html"><i class="fa fa-info-circle"></i> 关于我们</a></li>
            </ul>
        </div>

        <!-- 主导航菜单 -->
        <div class="main-menu">
            <ul>
                <li><a href="index.html">首页</a></li>
                <li><a href="history.html">历史沿革</a></li>
                <li><a href="geography.html">地理位置</a></li>
                <li><a href="culture.html">风俗文化</a></li>
                <li><a href="attractions.html">景点选择</a></li>
                <li><a href="products.html">名优特产</a></li>
                <li><a href="message.html">在线留言</a></li>
            </ul>
            <button class="menu-toggle"><i class="fa fa-bars"></i></button>
        </div>

        <!-- 内容区域 -->
        <div class="content">
            <div class="bar">
                <h3>黑龙江风俗文化</h3>
            </div>

            <div class="culture-container">
                <!-- 民俗展示区 -->
                <section class="folk-customs">
                    <h4><i class="fa fa-users"></i> 传统民俗</h4>

                    <div class="customs-grid">
                        <!-- 冰雪节 -->
                        <div class="custom-card">
                            <figure>
                                <img src="D:\img\img19.jpg" alt="哈尔滨冰雪节">
                                <figcaption>哈尔滨国际冰雪节</figcaption>
                            </figure>
                            <details>
                                <summary>哈尔滨国际冰雪节</summary>
                                <p>创立于1985年，每年1月5日开幕，是世界四大冰雪节之一。冰雪大世界、太阳岛雪博会、兆麟公园冰灯游园会是冰雪节的三大核心景区。</p>
                            </details>
                        </div>

                        <!-- 那达慕大会 -->
                        <div class="custom-card">
                            <figure>
                                <img src="D:\img\img20.jpg" alt="那达慕大会">
                                <figcaption>蒙古族那达慕大会</figcaption>
                            </figure>
                            <details>
                                <summary>那达慕大会</summary>
                                <p>蒙古族传统节日，"那达慕"意为"娱乐、游戏"，大会上有摔跤、赛马、射箭等传统体育项目，展现了草原民族的豪迈气概。</p>
                            </details>
                        </div>

                        <!-- 鄂伦春族狩猎文化 -->
                        <div class="custom-card">
                            <figure>
                                <img src="D:\img\img21.jpg" alt="鄂伦春族狩猎">
                                <figcaption>鄂伦春族狩猎文化</figcaption>
                            </figure>
                            <details>
                                <summary>鄂伦春族狩猎文化</summary>
                                <p>鄂伦春族是黑龙江省的少数民族之一，传统上以狩猎为生，其狩猎技艺、桦皮工艺和兽皮制作技艺被列入非物质文化遗产。</p>
                            </details>
                        </div>
                    
                    <!-- 赫哲族伊玛堪文化 -->
                    <div class="custom-card">
                        <figure>
                            <img src="D:\img\img32.jpg" alt="赫哲族伊玛堪">
                            <figcaption>赫哲族伊玛堪文化</figcaption>
                        </figure>
                        <details>
                            <summary>赫哲族伊玛堪</summary>
                            <p>伊玛堪是赫哲族的一种口头说唱艺术，被誉为"赫哲族的史诗"。它以讲唱结合的形式，叙述赫哲族的历史、英雄故事、生产生活等内容，语言生动形象，具有浓郁的民族特色，已被列入联合国教科文组织人类非物质文化遗产代表作名录。
                            </p>
                        </details>
                    </div>
                </div>
                </section>

                <!-- 传统艺术 -->
                <section class="traditional-arts">
                    <h4><i class="fa fa-paint-brush"></i> 传统艺术</h4>

                    <div class="arts-container">
                        <div class="art-item">
                            <h5>赫哲族鱼皮画</h5>
                            <div class="art-content">
                                <img src="D:\img\img22.jpg" alt="鱼皮画">
                                <p>赫哲族独特的传统工艺，以鱼皮为原料，经过鞣制、剪裁、粘贴等工序制成，题材多为渔猎场景和民间故事，具有浓郁的民族特色。</p>
                            </div>
                        </div>

                        <div class="art-item">
                            <h5>东北二人转</h5>
                            <div class="art-content">
                                <img src="D:\img\img23.jpg" alt="二人转">
                                <p>流行于东北地区的民间艺术形式，集说、唱、做、舞于一体，表演生动活泼，语言幽默风趣，是东北民间文化的重要代表。</p>
                            </div>
                        </div>
                    </div>
                </section>

                <!-- 饮食文化 -->
                <section class="food-culture">
                    <h4><i class="fa fa-cutlery"></i> 饮食文化</h4>

                    <div class="food-grid">
                        <div class="food-item">
                            <h5>东北铁锅炖</h5>
                            <p>黑龙江传统饮食，以铁锅为器具，炖煮各种食材，味道浓郁，体现了东北人豪爽的饮食风格。</p>
                        </div>

                        <div class="food-item">
                            <h5>俄式西餐</h5>
                            <p>受俄罗斯文化影响，哈尔滨等地的俄式西餐独具特色，如红菜汤、罐焖牛肉等深受当地人和游客喜爱。</p>
                        </div>

                        <div class="food-item">
                            <h5>朝鲜族冷面</h5>
                            <p>黑龙江朝鲜族特色美食，面条筋道，汤汁清凉，是夏季解暑佳品。</p>
                        </div>
                    </div>
                </section>

                <!-- 文化体验预约 -->
                <section class="culture-experience">
                    <h4><i class="fa fa-calendar-check-o"></i> 文化体验预约</h4>
                    <form class="experience-form">
                        <div class="form-group">
                            <label for="experience-name">姓名</label>
                            <input type="text" id="experience-name" class="form-control" required>
                        </div>

                        <div class="form-group">
                            <label for="experience-phone">电话</label>
                            <input type="tel" id="experience-phone" class="form-control" pattern="[0-9]{11}" required>
                            <span class="form-hint">请输入11位手机号码</span>
                        </div>

                        <div class="form-group">
                            <label for="experience-date">预约日期</label>
                            <input type="date" id="experience-date" class="form-control" required>
                        </div>

                        <div class="form-group">
                            <label for="experience-type">体验项目</label>
                            <select id="experience-type" class="form-control" required>
                                <option value="">请选择体验项目</option>
                                <option value="ice-carving">冰雕制作体验</option>
                                <option value="fish-skin">鱼皮画制作</option>
                                <option value="northeast-cuisine">东北菜烹饪</option>
                            </select>
                        </div>

                        <button type="submit" class="btn submit-btn">提交预约</button>
                    </form>
                </section>
            </div>
        </div>

        <!-- 页脚 -->
        <div class="end">
            <p>© 黑龙江旅游网 版权所有 | 联系电话：0451-12345678 | 地址：哈尔滨市南岗区中山路</p>
        </div>
    </div>

    <script>
        // 移动端菜单切换
        document.addEventListener('DOMContentLoaded', function () {
            const menuToggle = document.querySelector('.menu-toggle');
            const mainMenuUl = document.querySelector('.main-menu ul');

            menuToggle.addEventListener('click', function () {
                mainMenuUl.classList.toggle('show');
            });
        });
    </script>
</body>

</html>